<!DOCTYPE html>
<html lang="zh-CN">
    {{- partial "head.html" . -}}
    <body class="{{ with .Site.Params.hasActiveAnimate }}active-animate{{ end }} {{ with .Site.Params.hasActiveCool }}cool{{ end }}">
        {{ with .Site.Params.hasActiveFloatingBox }}{{- partial "floating-box.html" . -}}{{ end }}
        <div class="cool-before" style="{{ if .Site.Params.hasActiveCool }}background: url('/imgs/bg/{{with .Site.Params.coolBackground}}{{.}}{{else}}default.jpg{{end}}') left top/100% no-repeat fixed;{{ end }}"></div>
        <div id="header" class="{{if .IsHome}}header-home{{end}}">
            {{- partial "header.html" . -}}
        </div>
        <div id="content">
            {{- block "main" . }}{{- end }}
        </div>
        <div id="footer">
            {{- partial "footer.html" . -}}
        </div>
        <div class="cool-after" style="
            {{ if .Site.Params.hasActiveCool }}
                background-color: rgba(255, 255, 255, {{with .Site.Params.coolOpacity}}{{.}}{{else}}0.81{{end}}); 
                backdrop-filter: saturate({{with .Site.Params.coolSaturate}}{{.}}{{else}}180%{{end}}) blur({{with .Site.Params.coolBlur}}{{.}}{{else}}6px{{end}});
            {{end}}
            "></div>
    </body>
</html>
